<template>
  <div id="app">
    <router-view/>
    <!--        <theme-picker></theme-picker>-->
  </div>
</template>
<script>
import {mapGetters} from 'vuex'
// import ThemePicker from './layout/components/ThemePicker'
import watermark from '@/utils/watermark'
import {getAlarmList} from './api/alarm'

const alarmType = ['标签离线告警', '栅栏告警']
export default {
  name: 'App',
  // components: { ThemePicker },
  data() {
    return {
      list: {}
    }
  },
  computed: {
    ...mapGetters(['token'])
  },
  created() {
    if (process.env.NODE_ENV !== 'development') {
      const timer = setInterval(() => {
        this.setAlarm()
      }, 2000)
      // 销毁定时器
      this.$once('hook:beforeDestroy', () => {
        clearInterval(timer)
      })
    }

  },
  mounted() {
    // watermark.set('格诺诚三维定位系统')
  },
  methods: {
    getTheme() {
      this.$startLoading()
      /**
       *  1. 获取本地存储的主题
       *  2. 全局状态存储
       *  3. 监听该属性变化 切换主题
       */
      let localTheme = localStorage.getItem('theme')
      if (localStorage.getItem('theme')) {
        this.$store.commit('app/UPDATE_THEME', localTheme)
      }
    },
    setAlarm() {
      if (!this.token) return
      getAlarmList().then(res => {
        let data = res.obj
        let playList = []
        data.forEach(item => {
          if (!this.list.hasOwnProperty(item.id)) {
            this.list[item.id] = item
            playList.push(item)
          }
        })
        if (!playList.length) return
        for (let i = 0; i < playList.length; i++) {
          setTimeout(() => {
            this.$notify({
              title: alarmType[playList[i].type],
              message: playList[i].content,
              duration: 0,
              type: 'error',
              onClose: () => {
                delete this.list[playList[i].id]
              }
            })
          }, 0 + 200 * i)
        }
      })

    }
  }
}
</script>
<style lang="scss">

</style>
